/**
 * Created by Administrator on 2017/3/2.
 */
/**
 * Created by Administrator on 2017/2/22.
 */
window.onload = function(){
    leftSwipe();
};

var leftSwipe = function () {
    /*父盒子*/
    var parentBox = document.getElementsByClassName('jd_category_left')[0];
    /*子盒子*/
    var childBox = parentBox.getElementsByClassName('jd_category_left_box')[0];
    var childBoxLiList = childBox.getElementsByTagName('li');
    var topHeight = document.getElementsByClassName('jd_topBar')[0].offsetHeight;
    var parentH = parentBox.offsetHeight;
    var childH = childBox.offsetHeight;
    /*定位区间*/
    var maxPosition = 0;//最大的定位区间
    var minPosition = parentH - childH - topHeight;//最小的定位区间 其实就是需要滑动的位置

    /*缓冲的距离*/
    var distance = 150;
    /*滑动区间*/
    var maxSwipe = maxPosition + distance; // 最大滑动区间
    var minSwipe = minPosition - distance; // 最小滑动区间
    console.log(maxSwipe);
    console.log(minSwipe);
    var startY = 0,endY = 0,moveY = 0,currY = 0,upDownY = 150,startTime = 0,endTime = 0,distanceY = 0;
    //加过度
    var addTransition = function () {
        childBox.style.transition = "all .3s ease 0s";
        childBox.style.webkitTransition = "all .3s ease 0s";
    };
    var removeTransition = function () {
        childBox.style.transition = "none";
        childBox.style.webkitTransition = "none";
    };
    var setTransition = function (t) {
        childBox.style.transform = "translateY("+t+"px)";
        childBox.style.webkitTransform = "translateY("+t+"px)";
    };

    childBox.addEventListener('touchstart',function (e) {
        startTime = new Date().getTime();
        startY = e.touches[0].clientY; //开始y的距离
    });

    childBox.addEventListener('touchmove',function (e) {
        e.preventDefault();
        moveY = e.touches[0].clientY;
        distanceY = moveY - startY;
        //上下间距不大于upDownY的距离 上下滑动的限制
        if( (currY + distanceY) < maxSwipe && (currY + distanceY) > minSwipe )
        {
            removeTransition();
            setTransition(currY + distanceY);
        }
    });

    childBox.addEventListener('touchend',function (e) {
        endTime = new Date().getTime();
        //这里判定是因为继续滑动时，touch的clientY值是一直变化的，所以可以进行判定
        if((currY + distanceY) > maxPosition)
        {
            currY = maxPosition;
            addTransition();
            setTransition(currY);
        }
        /*将要定位的位子 小于  最小定位的时候*/
        else  if ((currY + distanceY) < minPosition){
            currY = minPosition;
            /*加过渡*/
            addTransition();
            /*设置位子*/
            setTransition(currY);
        }
        /*正常*/
        else {
            /*设置当前的定位*/
            currY = currY + distanceY;
        }
        /*重置参数*/
        startY = 0;
        moveY = 0;
        distanceY = 0;

        //点击进行类的添加
        if(endTime - startTime < 150 && distanceY == 0)
        {
            for(var i = 0; i < childBoxLiList.length; i++)
            {
                childBoxLiList[i].className = " ";
                childBoxLiList[i].index = i;
            }
            var li = e.target.parentNode;
            li.className = "now";
            var translateY = -li.index*50; //要移动的距离 向上滑动

            //当超过了最小定位区间的时候 不能定位 就是大于了可以移动的距离了，不能定位了
            if(translateY > minPosition)
            {
                currY = translateY;
                addTransition();
                setTransition(currY);
            }
            else
            {
                console.log(2);
                currY = minPosition;
                addTransition();
                setTransition(currY);
            }

        }
    });

};